﻿function MoneyCtrlDetail(){

};

var baseURL = "http://localhost:9090/api/";

MoneyCtrlDetail.prototype={
    // 头部导航功能
    navSlide: function(){
        var ul = document.querySelector('#nav ul');
        var liList = ul.children;
        ul.addEventListener('click',function(e){
            for(var i=0;i<liList.length;i++){
                liList[i].classList.remove('active');
            }
            var li=e.target.parentNode;
            li.classList.add('active');
        })

        var swiper = new Swiper('.swiper-container', {
            direction: 'horizontal',
            slidesPerView: 'auto',
            mousewheel: true,
          });  
    },

    getQueryString:function (name) {
        var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
        var r = window.location.search.substr(1).match(reg);
        if (r != null) {
            // return unescape(r[2]); 不能解决中文路径乱码问题
            return  decodeURI(r[2]); 
        }
        return null;
    },

    // 请求ajax加载页码
    loadPage:function(productid){
        var xhr = new XMLHttpRequest();
        xhr.open('get',baseURL+'getmoneyctrlproduct?productid='+productid);
        xhr.send();
        xhr.onload=function(){
            var obj=JSON.parse(xhr.responseText);
            
            // 渲染商品详情
            var html = template('productInfoTpl',{value:obj.result[0]})
            document.querySelector('#main .productInfo').innerHTML=html; 

            // 渲染商品库存
            var html1=obj.result[0].productCity;
            html1 = html1==""?"<p>该商品库存为空!</p>":html1;
            document.querySelector("#main .buy .repertory").innerHTML=html1;

            // 渲染评论区
            var html2=obj.result[0].productComment;
            document.querySelector("#main .comments").innerHTML=html2;

            // 渲染标题
            var html3=obj.result[0].productName;
            document.querySelector('title').innerHTML=html3;
        }
    },

    // 点击购买显示库存
    toBuy:function(){
        var btn = document.querySelector('#main .buy .tobuy');
        var repertory = document.querySelector('#main .buy .repertory');

        btn.onclick=function(){
            if( repertory.style.display=="block"){
                repertory.style.display="none";
            }else{
                repertory.style.display="block";
            } 
        }
    },

    // 返回顶部
    toTop:function(){
    var btn = document.querySelector('#footer .toTop');
    btn.onclick = function () { 
        document.documentElement.scrollTop=0   
    }
    },

    // // 设置根元素的字体大小
    // setHtmlFontSize:function(){
    //     function setFontsize(){
    //         var width = document.documentElement.offsetWidth;
    //         var fontsize = width/3.75;
    //         fontsize = fontsize >=256?256:fontsize; 
    //         document.querySelector('html').style.fontSize=fontsize+"px";
    //     }
    //     setFontsize();
    //     window.onresize=setFontsize;
    // }
}

var productDetail = new MoneyCtrlDetail();

window.addEventListener('load',function(){
    productDetail.navSlide();
    
    var productid=productDetail.getQueryString('productid')
    
    productDetail.loadPage(productid);
    productDetail.toBuy();
    productDetail.toTop();
})